<!doctype html>
<html lang="zh">

<head>
	<meta charset="UTF-8">
	<title>添加管理员</title>
	<link rel="stylesheet" href="./asset/css/components.css" />
	<link rel="stylesheet" href="./asset/css/bootstrap.css" />
	<link rel="stylesheet" href="./asset/css/plugins.css" />
	<link rel="stylesheet" href="./asset/css/main.css" />
	<link rel="stylesheet" href="./asset/css/themes.css" />
</head>

<body>
	<div id="body">
		<div id="app">
			<div class="tabbody">
				<div class="bodyli active">
					<div class="inputbox">
						<span class="title">用户名</span>
						<div class="inputright">
							<input type="text" id="username" v-model="username" class="form-control input-sm"
								placeholder="请输入用户名">
						</div>
					</div>
					<div class="inputbox">
						<span class="title">密码</span>
						<div class="inputright">
							<input type="password" id="password" v-model="password" class="form-control input-sm"
								placeholder="请输入密码">
						</div>
					</div>
					<div class="inputbox">
						<span class="title">姓名</span>
						<div class="inputright">
							<input type="text" id="realname" v-model="realname" class="form-control input-sm"
								placeholder="请输入姓名">
						</div>
					</div>
					<div class="inputbox">
						<span class="title">联系方式</span>
						<div class="inputright">
							<input type="text" id="contact" v-model="contact" class="form-control input-sm"
								placeholder="请输入联系方式">
						</div>
					</div>
						<div class="inputbox">
							<span class="title">类型</span>
							<div class="inputright">
								<select id="type" type="type" value="" style="flex: 1;height: 40px;border: 1px solid #ddd;padding: 0 10px;font-size: 14px;" name="type" v-model="type" lay-verify="">
									<option value="">请选择身份</option>
									<option value="1">用户</option>
									<option value="0">管理员</option>
								</select>
							</div>
						</div>

					<div class="tbfooter">
						<button class="btn btn-success" @click.prevent="save()"><i class="fa fa-floppy-o"></i>
							提交保存</button>
						&nbsp;&nbsp;&nbsp;
						<button class="btn btn-default" @click.prevent="reset()"><i class="fa fa-recycle"></i>
							取消重置</button>
					</div>
				</div>
			</div>
		</div>
	</div>
			<script type="text/javascript" src="./asset/js/jquery.min.js"></script>
			<script type="text/javascript" src="./asset/js/bootstrap.min.js"></script>
			<script type="text/javascript" src="./asset/js/axios.min.js"></script>
			<script type="text/javascript" src="./asset/js/vue.js"></script>
			<script type="text/javascript">
				const vue = new Vue({ // 实例化Vue对象
					el: '#app',// 绑定作用域
					data: { //定义数据
						username: '', // 定义用户名数据
						password: '', // 定义密码数据
						realname: '', // 定义姓名数据
						contact: '', // 定义联系方式数据
						type: '',
					},
					methods: {
						save: function () {
							let _this = this;
							var data = {
								username: _this.username,
								password: _this.password,
								realname: _this.realname,
								contact: _this.contact,
								type:_this.type,
							};
							axios.post('http://127.0.0.1:8080/equipment/admin/insertAdmin.action', data).then(result => {
								if (result.data.code > 0) {
									if (window.confirm('保存成功,是否继续添加？')) {
										_this.reset();
									} else {
										var index = parent.layer.getFrameIndex(window.name);
										parent.location.reload();
										parent.layer.close(index);
									}
								} else {
									console.log('保存失败,请稍后再试');
								}
							});
						},
						reset: function () {
							this.pageLoad();
						},
						pageLoad: function () { // 页面加载
							this.username = '';
							this.password = '';
							this.realname = '';
							this.contact = '';
						},
						validate: function () { // 验证输入非空
						},
					},
					created() { // 生命周期相关的函数
						let _this = this;
						_this.pageLoad();
					},
				})
			</script>

</body>

</html>